<%--
  Created by IntelliJ IDEA.
  User: 14365
  Date: 2021/9/30
  Time: 11:06
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>会员租车</title>
    <!--导入css文件-->
    <link href="${pageContext.request.contextPath}/css/index.css" rel="stylesheet">
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/image/title-img1.png">
    <style>

        /* 头部导航的 */
        .global-header .login-page-header-nav li {
            float: left;
            margin-left: 30px;
        }
        .global-header .login-page-header-nav li i {
            margin-right: 10px;
            font-size: 28px;
            line-height: 1;
            color: #f6a206;
            vertical-align: middle;
        }
        .global-login-iconfont {
            font-family: "login-iconfont",serif;
            font-style: normal;
            font-weight: normal;
            cursor: default;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            *zoom: 1;
        }
        .global-header .login-page-header-nav li span {
            font-size: 14px;
            line-height: 28px;
            color: #666;
            vertical-align: middle;
        }
    </style>
</head>

<link rel="stylesheet" href="${pageContext.request.contextPath}/css/index-1.css">
<link href="${pageContext.request.contextPath}/css/headermenu.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/css/members.css" rel="stylesheet">


<body>
<header id="J-global-header" class="global-header">
    <div class="top-inner">
        <div id="sitenav" class="global-header-top-nav fn-clear">
            <div class="global-header-top-nav-right">
                <li class="top-nav-menu top-nav-menu-user-info" data-role="user-info" data-test="test">
                    <div class="top-nav-menu-handle">
                        <div class="login">
                            <%--                            <a href="${pageContext.request.contextPath}/login.jsp" class="J-login-btn" rel="nofollow" target="_self">登录/注册</a></div>--%>
                            <c:if test="${empty ServiceResponse}">
                                <a href="${pageContext.request.contextPath}/customer/login.jsp">登录/注册</a>
                            </c:if>

                            <c:if test="${!empty ServiceResponse}">
                                欢迎${ServiceResponse.data.custTelno}
                                <a href="${pageContext.request.contextPath}/logout">退出</a>
                            </c:if>
                        </div>
                    </div>
                </li>

                <li class="top-nav-menu top-nav-multi-menu top-nav-dl-app">
                    <div class="top-nav-menu-handle">
                        <i class="global-header-icon top-nav-dl-app-icon"></i>手机版
                    </div>
                    <div class="top-nav-menu-body top-nav-menu-qrcode">
                        <div class="top-nav-menu-bd-panel">
                            <div class="qrcode-img"></div>
                            <p>下载APP 领99元租车红包

                            </p>
                        </div>
                    </div>
                </li>

                <li class="top-nav-pipe">|</li>

                <li class="top-nav-menu top-nav-multi-menu top-nav-wx-guide">
                    <div class="top-nav-menu-handle"><i class="global-header-icon top-nav-wx-guide-icon"></i>微信</div>
                    <div class="top-nav-menu-body top-nav-menu-qrcode">
                        <div class="top-nav-menu-bd-panel">
                            <div class="qrcode-img"></div>
                            <p>扫一扫，关注微信</p>
                        </div>
                    </div>
                </li>
                <li class="top-nav-menu top-nav-multi-menu top-nav-order-lookup">
                    <div class="top-nav-menu-handle">订单查询<i class="top-nav-arrow"><em></em><span></span></i></div>
                    <div class="top-nav-menu-body top-nav-menu-list">
                        <div class="top-nav-menu-bd-panel">
                            <a href="${pageContext.request.contextPath}/center/myorder.jsp">订单查询</a>
                        </div>
                    </div>
                </li>
                <li class="top-nav-menu top-nav-multi-menu top-nav-order-lookup">
                    <div class="top-nav-menu-handle">个人中心<i class="top-nav-arrow"><em></em><span></span></i></div>
                    <div class="top-nav-menu-body top-nav-menu-list">
                        <div class="top-nav-menu-bd-panel">
                            <a href="${pageContext.request.contextPath}/center/user.jsp">进入个人中心</a>
                        </div>
                    </div>
                </li>
                <li class="top-nav-pipe">|</li>

            </div>

            <div class="global-header-top-nav-left">
                <div class="top-nav-menu top-nav-multi-menu top-nav-contact">
                    <div class="top-nav-menu-handle">
                        24小时客服！内地热线：110-120
                        <i class="top-nav-arrow"><em></em><span></span></i>
                    </div>
                    <div class="top-nav-menu-body top-nav-menu-list">
                        <div class="top-nav-menu-bd-panel">
                            <ul>
                                <li>
                                    <span class="title">中国内地热线</span>
                                    <a href="tel:10101020" target="_self" class="tel-number">110-120</a>
                                </li>
                            </ul>
                            <div class="top-nav-menu-bd-code">
                                <div class="qrcode-img"></div>
                                <p class="title">关注微信公众号</p>
                                <p class="text">可查询/修改/取消订单</p>
                                <a class="J-show-robot" href="javascript:" target="_self"
                                   data-tj="/公用头部/在线客服">24小时在线客服</a>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <div class="toolbar fn-clear">
        <div id="slog" class="logo fn-left">
            <a class="sbx-logo" title="思必行-租车" target="_self" href="">

            </a>
        </div>
        <div class="toolbar-site-header-nav">
            <ul class="login-page-header-nav fn-clear">
                <li><i class="global-login-iconfont">&#xe909;</i><span>有驾照就能租</span></li>
                <li><i class="global-login-iconfont">&#xe906;</i><span>地图导航</span></li>
                <li><i class="global-login-iconfont">&#xe908;</i><span>24小时服务在线</span></li>
            </ul>
        </div>

    </div>
</header>

<!--导航-->
<div class="nav">
    <ul class="nav-wrap clear_float" id="J_NavBox">
        <li>
            <a href="../index.jsp" target="_blank">首页</a>
            <span></span>
        </li>
        <li >
            <a href="../selfrental/person_rentalcar.jsp" target="_blank">自驾租车</a>
            <span></span>
        </li>
        <li class>
            <a href="../car/car.jsp" target="_blank">车型查询</a>
            <span></span>
        </li>
        <li class="menu-index menu-index-on">
            <a href="../memberrent/members.jsp" target="_blank">会员租车</a>
            <span></span>
        </li>
        <li>
            <a href="../store/store.jsp" target="_blank">营业网点</a>
            <span></span>
        </li>
        <li>
            <a href="../memberrent/wonderful_activity.jsp" target="_blank">精彩活动</a>
            <span></span>
        </li>
    </ul>
</div>

<!--会员租车介绍、与普通用户对比-->
<div class="blue-block">
    <!--六大特权-->
    <div class="easy-vip">
        <div class="w">
            <h2> 会员专享 六大特权</h2>
            <ul class="vip-lists clearfix">
                <li class="item fl">
                    <span class="vip-icon-03"></span>
                    <p class="bold">暖心套餐</p>
                    <p class="normal">暖暖的很贴心</p>
                </li>
                <li class="item fl">
                    <span class="vip-icon-04"></span>
                    <p class="bold">驾驶指导*</p>
                    <p class="normal">当地司机现场教学</p>
                </li>
                <li class="item fl">
                    <span class="vip-icon-01"></span>
                    <p class="bold">严选好车</p>
                    <p class="normal">保证车况良好</p>
                </li>
                <li class="item fl">
                    <span class="vip-icon-02"></span>
                    <p class="bold">安心车险</p>
                    <p class="normal">无忧全险含道路救援费用</p>
                </li>
                <li class="item fl">
                    <span class="vip-icon-05"></span>
                    <p class="bold">免预授权</p>
                    <p class="normal">到店不刷预授权</p>
                </li>
                <li class="item fl">
                    <span class="vip-icon-06"></span>
                    <p class="bold">VIP通道</p>
                    <p class="normal">免手续 免排队</p>
                </li>
            </ul>

        </div>
    </div>

</div>

<!-- 普通租车vs会员租车-->
<div class="easy-compare">
    <h6>普通租车 VS 会员租车</h6>
    <table>
        <tbody>
        <tr>
            <th class="col-1"></th>
            <th class="col-2">普通租车</th>
            <th class="col-3">会员租车</th>
        </tr>
        <tr>
            <td class="col-1">驾照要求</td>
            <td class="col-2">自行办理翻译件</td>
            <td class="col-3">
                <i class="icons-checked"></i>
                <p class="easy-benefit">
                    可免费提供驾照翻译件*
                </p>
            </td>
        </tr>
        <tr>
            <td class="col-1">服务语言</td>
            <td class="col-2">当地语言或英文</td>
            <td class="col-3">
                <i class="icons-checked"></i>
                <p class="easy-benefit">
                    中文服务，微信随时在线*
                </p>
            </td>
        </tr>
        <tr>
            <td class="col-1">车况&amp;服务</td>
            <td class="col-2">不同品牌质量不一</td>
            <td class="col-3">
                <i class="icons-checked"></i>
                <p class="easy-benefit">
                    租租车严选保障
                </p>
            </td>
        </tr>
        <tr>
            <td class="col-1">取还车</td>
            <td class="col-2">乘坐大巴前往门店</td>
            <td class="col-3">
                <i class="icons-checked"></i>
                <p class="easy-benefit">
                    专车接送取还
                </p>
            </td>
        </tr>
        <tr>
            <td class="col-1">保险</td>
            <td class="col-2">需选购多种保险套餐</td>
            <td class="col-3">
                <i class="icons-checked"></i>
                <p class="easy-benefit">
                    覆盖全车保险+道路救援（无忧全险套餐）
                </p>
            </td>
        </tr>
        <tr>
            <td class="col-1">租车押金</td>
            <td class="col-2">
                门店预授权$500-$3000，还车后1-2月返还
            </td>
            <td class="col-3">
                <i class="icons-checked"></i>
                <p class="easy-benefit">
                    享芝麻信用免押金（或预缴押金，还车后退还）
                </p>
            </td>
        </tr>
        <tr class="last-row">
            <td class="col-1">当地驾驶</td>
            <td class="col-2">
                自行提前熟悉交规
            </td>
            <td class="col-3">
                <i class="icons-checked"></i>
                <p class="easy-benefit">
                    专人陪同，驾驶指导
                </p>
            </td>
        </tr>
        </tbody>
    </table>

</div>

<!--会员活动-->
<h2>会员优惠活动</h2>
<div class="fav-list">
    <div class="yhhdlist">
        <div class="top-item">
            <div class="item-vessel">
                <img  class="fav-img" src="${pageContext.request.contextPath}/image/member3.jpg">
                <h3 class="fav-title">国庆节抽免7天租车券活动</h3>
                <p class="fav-con"></p>
            </div>
            <div class="check-detail">
                <a class="detail-btn" href="https://huodong.zuche.com/fes/2021/2021gqcj.html?utm_source=guanfang&utm_medium=pc&campaign_code=2021free7day">
                    查看活动
                </a>
            </div>
        </div>

        <div class="top-item">
            <div class="item-vessel">
                <img  class="fav-img" src="${pageContext.request.contextPath}/image/member-img4.png">
                <h3 class="fav-title">自驾吧！青年</h3>
                <p class="fav-con"></p>
            </div>
            <div class="check-detail">
                <a class="detail-btn" href="https://huodong.zuche.com/fes/2021/2021gqydpc.html?utm_source=guanfang&utm_medium=pc&campaign_code=2021gqyd">
                    查看活动
                </a>
            </div>
        </div>

        <div class="top-item">
            <div class="item-vessel">
                <img  class="fav-img" src="${pageContext.request.contextPath}/image/member-img5.jpg">
                <h3 class="fav-title">会员租一送一</h3>
                <p class="fav-con"></p>
            </div>
            <div class="check-detail">
                <a class="detail-btn" href="https://huodong.zuche.com/fes/2021/2021shuqi3.html?utm_source=guanfang&utm_medium=pc&campaign_code=2021sqcj3">
                    查看活动
                </a>
            </div>
        </div>
    </div>
    <!--页脚-->
    <div class="footer">
        <div class="w1180">
            <div class="website-advantage">
                <ul class="wadvantage-list">
                    <li>
                        <span class="city"></span>
                        <p>450多座城市</p>
                    </li>
                    <li>
                        <span class="dunpai"></span>
                        <p>7000多服务网点</p>
                    </li>
                    <li>
                        <span class="car"></span>
                        <p>200余种车型</p>
                    </li>
                    <li>
                        <span class="sun"></span>
                        <p>24小时服务</p>
                    </li>
                </ul>
            </div>
        </div>
    </div>

</div>

</body>
</html>